// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'
import App from './App'
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
import MintUI from 'mint-ui'
import 'mint-ui/lib/style.css'
import router from './router'
import axios from 'axios'
import Vuex from 'vuex'

Vue.config.productionTip = false
Vue.use(ElementUI)
Vue.use(MintUI)
Vue.use(Vuex)

const store = new Vuex.Store({
  state: {
    count: 0,
    name: 'Jack Ma',
    arr: [1,2,3],
    allThings: []
  },
  getters: {
    newCount(state) {
      // ...
      console.log('getters')
      return store.state.count + 1
    },
    todoThings(state) {
      return store.state.allThings.filter(item => {
        return item.type == 1
      })
    },
    doneThings(state) {
      return store.state.allThings.filter(item => {
        return item.type == 2
      })
    }
  },
  mutations: {
    increment (state) {
      state.count++
    },
    add5(state) {
      state.count += 5
    },
    change(state, payload) {
      state.count = payload.result
    },
    change1(state, payload) {
      state.count = payload.num1 + payload.num2
    },
    addTodo(state, payload) {
      state.allThings.push(payload);
      localStorage.setItem('allThings', JSON.stringify(state.allThings))
    },
    moveToDone(state, payload) {
      state.allThings.forEach(item => {
        if(item.id == payload) {
          item.type = 2
        }
      })
      localStorage.setItem('allThings', JSON.stringify(state.allThings))
    },
    // 恢复历史记录
    resetHistory(state, payload) {
      state.allThings = payload
    }
  },
  actions: {
    add5Async(context) {
      context.commit('add5');
    },
    increment(context) {
      context.commit('increment')
    }
  }
})

// 替换vue本来的http模块
Vue.prototype.$http = axios

// 添加请求拦截器
axios.interceptors.request.use(function (config) {
  // 在发送请求之前做些什么
  console.log('请求即将发送111')
  return config;
}, function (error) {
  // 对请求错误做些什么
  return Promise.reject(error);
});

router.beforeEach((to, from, next) => {
  console.log('我是全局的前置守卫',666);
  next()
})

/* eslint-disable no-new */
new Vue({
  el: '#app',
  router,
  store,
  components: { App },
  template: '<App/>'
})
